<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html">
    <h:head>
        <title>#{applicationBean.appName}</title>
        <style>
      *
      {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
      }
 
      body
      {
        max-width: 500px;
        margin: 2em auto;
        padding: 0 0.5em;
        font-size: 20px;
      }
 
      h1,
      .buttons-wrapper
      {
        text-align: center;
      }
 
      .hidden
      {
        display: none;
      }
 
      #text,
      #log
      {
        display: block;
        width: 100%;
        height: 5em;
        overflow-y: scroll;
        border: 1px solid #333333;
        line-height: 1.3em;
      }
 
      .field-wrapper
      {
        margin-top: 0.2em;
      }
 
      .button-demo
      {
        padding: 0.5em;
        display: inline-block;
        margin: 1em auto;
      }
    </style>
       
    </h:head>
    <h:body onload="testBrowser()">
        <h:form>
        <h:outputScript library="js" name="common.js"/>
        <h1>#{applicationBean.appName}</h1>
 
        <span id="ss-unsupported" class="hidden">API not supported</span>    
    
    <button id="button-reaload-ss" class="button-demo" title="Reload">
        Refresh
    </button>
      <textarea id="text">#{alumnoBean.texto.cuerpo}</textarea>      
      
      <div class="buttons-wrapper">
          
          <button id="button-talk-ss" class="button-demo" title="Talk">
              <img id="imgMic" src="mic.gif"/>
          </button>
          
          <button id="button-speak-ss" class="button-demo" title="Listen text">
              <img src="speak.png"/>
          </button>
          
          <button id="button-stop-ss" class="button-demo" title="Stop">
              <img src="stop.png"/>
          </button>
          <button id="button-pause-ss" class="button-demo" title="Pause">
              <img src="pause.png"/>
          </button>
          <button id="button-resume-ss" class="button-demo" title="Resume">
              <img src="resume.png"/>
          </button>
          
          <textarea id="outText" cols="55" rows="3"></textarea>
          <button id="button-evaluate-ss" class="button-demo">
              Evaluar
          </button>
      </div>
    
 
    
    
    <h3>Log</h3>
    <div id="log"></div>
    <button id="clear-all" class="button-demo">Clear all</button>
 
    
    </h:form>
    </h:body>
</html>

